<!DOCTYPE html> 

<html>
<head>        
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />  
	<link rel="shortcut icon" href="" type="image/x-icon" />
	<title>ENTERSO CodeCleaner - Panel administracyjny</title> 
</head>

<body>
	
<div id="wrapper">
	<ul class="cc_tabs_menu">
		<li class="active menu_elem">CodeCleaner</li>
		<li class="menu_elem">CSS</li>
		<li class="menu_elem">JavaScript</li>
		<li class="menu_elem">Headers</li>
		<li class="menu_elem">SEO</li>
		<li class="menu_elem">Pomoc</li>
		<a href="?codecleaner=logout" class="menu_elem">Wyloguj</a>
	</ul>
	
	<form method="post" action="?cc_action=save">
		<fieldset class="fieldset_box">
			<legend class="hide">CodeCleaner</legend>
			<div class="fields">
				<label for="active">CodeCleaner aktywny</label>
				<input type="checkbox" value="1" name="active" id="active" class="checkbox" {checked:active} />     
			</div>
			<div class="fields">
				<label for="password">Zmień hasło</label>
				<input type="password" value="" name="password" id="password" class="input" />   
			</div>
		</fieldset>
		<fieldset class="fieldset_box hide">
			<legend class="hide">CSS</legend>
			<div class="fields">
				<label for="gzip_css">Konwertuj nazwy kolorów do HEX</label>
				<input type="checkbox" value="1" name="opt_colours2hex" class="checkbox" {checked:opt_colours2hex} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Skróć kody HEX</label>
				<input type="checkbox" value="1" name="opt_short_hex" class="checkbox" {checked:opt_short_hex} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Zmień kody HEX na kolory</label>
				<input type="checkbox" value="1" name="opt_hex2colours" class="checkbox" {checked:opt_hex2colours} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Zmień kolory RGB na HEX</label>
				<input type="checkbox" value="1" name="opt_rgb2hex" class="checkbox" {checked:opt_rgb2hex} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Usuń puste atrybuty</label>
				<input type="checkbox" value="1" name="opt_remove_zeros" class="checkbox" {checked:opt_remove_zeros} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Połącz identyczne reguły</label>
				<input type="checkbox" value="1" name="opt_combine_identical_rules" class="checkbox" {checked:opt_combine_identical_rules} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Połącz identyczne atrybuty</label>
				<input type="checkbox" value="1" name="opt_combine_identical_selectors" class="checkbox" {checked:opt_combine_identical_selectors} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Połącz właściwości</label>
				<input type="checkbox" value="1" name="opt_combine_props_list" class="checkbox" {checked:opt_combine_props_list} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Usuń nadpisane właściwości</label>
				<input type="checkbox" value="1" name="opt_remove_overwritten_properties" class="checkbox" {checked:opt_remove_overwritten_properties} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Skróć właściwości "margin" i "padding"</label>
				<input type="checkbox" value="1" name="opt_short_margins_and_paddings" class="checkbox" {checked:opt_short_margins_and_paddings} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Zmień wagi tekstowe na liczby</label>
				<input type="checkbox" value="1" name="opt_text_weights_to_numbers" class="checkbox" {checked:opt_text_weights_to_numbers} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Pokaż statystyki</label>
				<input type="checkbox" value="1" name="opt_output_stats" class="checkbox" {checked:opt_output_stats} />     
			</div>
			<div class="fields">
				<label for="gzip_css">Połącz CSS w jeden plik</label>
				<input type="checkbox" value="1" name="opt_combine_css" class="checkbox" {checked:opt_combine_css} />     
			</div>
		</fieldset>
		<fieldset class="fieldset_box hide">
			<legend class="hide">JavaScript</legend>
			<div class="fields">
				<label for="gzip_js">Kompresja GZIP</label>
				<input type="checkbox" value="1" name="gzip_js" id="gzip_js" class="checkbox" {checked:gzip_js} />     
			</div>
			<div class="fields">
				<label for="whitespace_js">Usuń białe znaki</label>
				<input type="checkbox" value="1" name="whitespace_js" id="whitespace_js" class="checkbox" {checked:whitespace_js} />   
			</div>
			<div class="fields">
				<label for="merge_js">Połącz JavaScript</label>
				<input type="checkbox" value="1" name="merge_js" id="merge_js" class="checkbox" {checked:merge_js} />   
			</div>
		</fieldset>
		<fieldset class="fieldset_box hide">
			<legend class="hide">Headers</legend>
			<div class="fields">
				<label for="">Header A</label>
				<input type="checkbox" value="1" name="" id="" class="checkbox" />     
			</div>
			<div class="fields">
				<label for="">Header B</label>
				<input type="checkbox" value="1" name="" id="" class="checkbox" />   
			</div>
			<div class="fields">
				<label for="">Header C</label>
				<input type="checkbox" value="1" name="" id="" class="checkbox" >   
			</div>
		</fieldset>
		<fieldset class="fieldset_box hide">
			<legend class="hide">SEO</legend>
			<div class="fields">
				<label for="add_alt_attr">Uzupełniaj "ALT"</label>
				<input type="checkbox" value="1" name="add_alt_attr" id="add_alt_attr" class="checkbox" {checked:add_alt_attr} />   
			</div>
			<div class="fields">
				<label for="add_title_attr">Uzupełniaj "TITLE"</label>
				<input type="checkbox" value="1" name="add_title_attr" id="add_title_attr" class="checkbox" {checked:add_title_attr} />
			</div>
		</fieldset>
		<fieldset class="fieldset_box hide">
			<legend class="hide">Pomoc</legend>
			<p>help tab...</p>
		</fieldset>
		<fieldset class="fieldset_box fieldset_save">
			<legend class="legend_box">Zapisz</legend>
			<div class="fields">
				<input type="hidden" name="save" value="1" />
				<input type="submit" name="submit" class="submit" value="Zapisz" />
			</div>
		</fieldset>
	</form>
</div>
	
</body>  
<style type="text/css">
	
	body {
		font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
		font-size: 0.8em;
	}
	
	#wrapper {
		width: 600px;
		margin: 0 auto;
	}
	
	.cc_tabs_menu {
		list-style: none;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		border-bottom: 1px solid #D7DCE9;
		height: 21px;
	}
	
	.cc_tabs_menu li, .cc_tabs_menu a {
		display: inline-block;
		border-top: 1px solid #D7DCE9;
		border-left: 1px solid #D7DCE9;
		border-right: 1px solid #D7DCE9;
		padding: 0 10px;
		cursor: pointer;
		cursor: pointer;
		height: 20px;
		line-height: 20px;
	}
	
	.cc_tabs_menu a, .cc_tabs_menu a:visited {
		color: #E5E5E5;
		text-decoration: none;
	}
	
	.cc_tabs_menu a:hover {
		color: #000;
	}
	
	.active {
		border-bottom: 1px solid #FFF;
	}
	
	.fieldset_box {
		border: 1px solid #D7DCE9;
		border-top: 0px;
		margin: 0;
	}
	
	.fieldset_save {
		margin-top: 15px;
		border: 1px solid #D7DCE9;
	}
	
	.legend_box {
		border: 1px solid #D7DCE9;
		padding: 2px 15px;
	}
	
	.fields {
		margin: 5px 0 2px 0;
	}       
	
	.fieldset legend {
		padding: 0 5px;
	} 
	
	.fields label {
		margin: 0 15px 0 25px; 
		width: 370px;
		float: left;
	}
	
	.checkbox {
		/*float: left;
		margin: 3px 15px 0 25px; */
	} 
	
	.submit {
		margin: 0 15px 0 25px;
	}
	
	.hide {
		display: none;
	}
	
</style>
<script type="text/javascript">
	
	var menu_tabs = getElementsByClassName("menu_elem", document.getElementById("wrapper"));
	var fieldset_tabs = getElementsByClassName("fieldset_box", document.getElementById("wrapper"));
	var active_menu = menu_tabs[0];
	var active_fieldset = fieldset_tabs[0];
	
	for(var i in menu_tabs){
		menu_tabs[i].addEventListener("click", activateMenu, false);
	}
	
	function activateMenu(){
		if(this == menu_tabs[menu_tabs.length - 1]){
			return false;
		}
		active_menu.className = "";
		active_menu = this;
		active_menu.className = "active";
		
		active_fieldset.style.display = "none";
		active_fieldset = fieldset_tabs[menu_tabs.indexOf(active_menu)];
		active_fieldset.style.display = "block";
	}
	
	function getElementsByClassName(classname, node){
	    if(!node){
			node = document.getElementsByTagName("body")[0];
		}
	    var a = [];
		var backb = "\\b";
	    var re = new RegExp(backb + classname + backb);
	    var els = node.getElementsByTagName("*");
	    for(var i = 0, j = els.length; i < j; i++){
	        if(re.test(els[i].className)){
				a.push(els[i]);
			}
		}
	    return a;
	}
	
</script>
</html>